<template>
  <div>
    <div v-if="!isLogin">
      <!-- 
      子组件向父组件传递数据，将父组件的函数传递到子组件中，
      子组件调用父组件函数来设置父组件的属性值 
      -->
      <Home :login="execLogin"></Home>
    </div>
    <div v-else>
      <el-container style="height: 600px; border: 0px solid #eee">
          <Aside :login="execLogin"></Aside>
          <!-- 这里要加el-container标签 -->
          <el-container>
            <el-header style="text-align: right; font-size: 12px;">
              <Header :login="execLogin"></Header>
            </el-header>
            
            <el-main>
              <!-- <Home></Home> -->
              <router-view></router-view>
            </el-main>
          </el-container>
      </el-container>
    </div>
  </div>
</template>
  
<script>
  import Aside from '../components/Aside.vue';
  import AdminList from '../pages/admin/AdminList.vue';
  import Header from '../components/Header.vue';
  import Home from '@/pages/Home.vue';
  
  export default {
    name:'Index',
    props:['userName', 'userPwd'],
    data() {
      return {
        isLogin:false
      }
    },
    components:{
      Aside,
      Header,
      AdminList,
      Home
    },
    beforeMount(){
      // let ticket = this.$cookies.get('ticket')
      // console.log('ticket信息：', ticket)
      let ticketJsonStr = localStorage.getItem('ticket')
      if(!ticketJsonStr){
        //清除存储
        localStorage.removeItem('ticket')
        //判断是否是登录状态
        this.isLogin = false
        //回退到原页面
        location.href = 'http://localhost:8002/#/'
      } else {
        console.log('ticketJsonStr信息：', ticketJsonStr)
        let ticketJson = JSON.parse(ticketJsonStr)
        console.log('ticketJson信息：', ticketJsonStr)
        let token = ticketJson.token
        console.log('token信息：', token)
        let expireTime = ticketJson.expireTime
        console.log('过期时间：', token)
        if(Date.now() > expireTime){
          //清除存储
          localStorage.removeItem('ticket')
          //设置状态为未登录
          this.isLogin = false
          //回退到原页面
          location.href = 'http://localhost:8002/#/'
        } else {
          //设置状态为已登录
          this.isLogin = true
        }
      }
    },
    beforeUpdate(){
      // this.$bus.$on('loginIn', this.execLogin)
    },
    methods:{
      execLogin(login){
        console.log('登录数据：',login)
        this.isLogin = login
      }
    }
  };
</script>

<style>
  .el-header {
    background-color: #B3C0D1;
    color: #333;
    line-height: 60px;
  }
  
  .el-aside {
    color: #333;
  }


</style>